<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

    <!--音乐播放软件-->
        <div class="cube-player aplayer aplayer-withlrc aplayer-withlist" id="cube-player" th:fragment="copy">
            <div class="aplayer-pic" style="background-image: url('http://cube-1252774894.cosgz.myqcloud.com/music/image/TRIPLANE - Dear friends.jpg');">
                <div class="aplayer-button aplayer-play">
                    <button type="button" class="aplayer-icon aplayer-icon-play">
                        <svg xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" version="1.1" viewBox="0 0 16 31" width="100%">
                            <use xlink:href="#aplayer-play"></use>
                            <path class="aplayer-fill" d="M15.552 15.168q0.448 0.32 0.448 0.832 0 0.448-0.448 0.768l-13.696 8.512q-0.768 0.512-1.312 0.192t-0.544-1.28v-16.448q0-0.96 0.544-1.28t1.312 0.192z" id="aplayer-play"></path>
                        </svg>
                    </button>
                </div>
            </div>
            <div class="aplayer-info">
                <div class="aplayer-music">
                    <span class="aplayer-title">Dear friends</span>
                    <span class="aplayer-author">TRIPLANE</span>
                </div>
                <div class="aplayer-lrc">
                    <div class="aplayer-lrc-contents" style="transform: translateY(0); -webkit-transform: translateY(0);"><p class="aplayer-lrc-current">毎日陽が沈むまで 泥まみれになりながら</p><p>完成したパズルを届けよう难忘儿时天真的我们每天夕阳西下</p><p>無邪気に過ごした日々も捨て難いけれど</p><p>满身灰泥那无忧无虑的日子</p><p>夢見る僕が居てもそれはそれで僕だから</p><p>那是做著美好的梦的我</p><p>ジグソーパズルみたいにはまってなくて良い</p><p>可以不必在乎那些拼图</p><p>别人说的「对」对你来说和「错」没有两样</p><p>誰かの「Yes」が君にとって「No」であるのと同じように</p><p>いつだって自由なはずだから</p><p>无论何时都应该如此自由</p><p>就算明天大风吹散了拼图</p><p>明日 風が通り抜けた時にパズルが欠けていたとしても</p><p>也不会有人责备</p><p>誰もそれを責めたりしないよ</p><p>あの日夢見た僕らは 間違いじゃないと信じて</p><p>那一天憧憬著梦想的我们坚信著彼此的信念</p><p>荒くうねる海原を渡って行ける</p><p>跨过波涛汹涌的大海</p><p>你的痛苦我们比谁都清楚</p><p>君の胸の痛みだって 僕らは知っているから</p><p>即使你离开这条船去了不同的世界</p><p>もしも君がこの船を下りて違う世界に居たとしても</p><p>最後にはきっと笑えるよ</p><p>最后也定能开怀大笑</p><p>今でも僕らは夢を見ているよ</p><p>现在我们仍然在憧憬著梦想</p><p>乘着这个被托付的梦想向前进</p><p>託されたその想いも乗せて</p><p>这片汹涌的海洋上有痛苦的回忆我们一路奋战到今天还要向前</p><p>荒れたこの海原を痛みと戦って今日も行く</p><p>約束が嘘にならないように</p><p>约定的誓言永远不会是谎言</p><p>そしていつか 僕らの船を下りた違う世界に居る君に</p><p>直到有一天</p><p>完成したパズルを届けよう难忘儿时天真的我们每天夕阳西下</p><p>一定会把完成的拼图传递</p></div>
                </div>
                <div class="aplayer-controller">
                    <div class="aplayer-bar-wrap">
                        <div class="aplayer-bar">
                            <div class="aplayer-loaded" style="width: 74.4389%;"></div>
                            <div class="aplayer-played" style="width: 0; background: #b7daff;">
                                <span class="aplayer-thumb" style="border: 1px solid #b7daff;"></span>
                            </div>
                        </div>
                    </div>
                    <div class="aplayer-time">
                            <span class="aplayer-time-inner">
                                - <span class="aplayer-ptime">00:00</span> / <span class="aplayer-dtime">04:32</span>
                            </span>
                        <div class="aplayer-volume-wrap">
                            <button type="button" class="aplayer-icon aplayer-icon-volume-down">
                                <svg xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" version="1.1" viewBox="0 0 28 32" width="100%">
                                    <use xlink:href="#aplayer-volume-down"></use>
                                    <path class="aplayer-fill" d="M13.728 6.272v19.456q0 0.448-0.352 0.8t-0.8 0.32-0.8-0.32l-5.952-5.952h-4.672q-0.48 0-0.8-0.352t-0.352-0.8v-6.848q0-0.48 0.352-0.8t0.8-0.352h4.672l5.952-5.952q0.32-0.32 0.8-0.32t0.8 0.32 0.352 0.8zM20.576 16q0 1.344-0.768 2.528t-2.016 1.664q-0.16 0.096-0.448 0.096-0.448 0-0.8-0.32t-0.32-0.832q0-0.384 0.192-0.64t0.544-0.448 0.608-0.384 0.512-0.64 0.192-1.024-0.192-1.024-0.512-0.64-0.608-0.384-0.544-0.448-0.192-0.64q0-0.48 0.32-0.832t0.8-0.32q0.288 0 0.448 0.096 1.248 0.48 2.016 1.664t0.768 2.528z" id="aplayer-volume-down"></path>
                                </svg>
                            </button>
                            <div class="aplayer-volume-bar-wrap">
                                <div class="aplayer-volume-bar">
                                    <div class="aplayer-volume" style="height: 80%; background: #b7daff;"></div>
                                </div>
                            </div>
                        </div>
                        <button type="button" class="aplayer-icon aplayer-icon-mode">
                            <svg xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" version="1.1" viewBox="0 0 29 32" width="100%">
                                <use xlink:href="#aplayer-circulation"></use>
                                <path class="aplayer-fill" d="M25.6 9.92q1.344 0 2.272 0.928t0.928 2.272v9.28q0 1.28-0.928 2.24t-2.272 0.96h-22.4q-1.28 0-2.24-0.96t-0.96-2.24v-9.28q0-1.344 0.96-2.272t2.24-0.928h8v-3.52l6.4 5.76-6.4 5.76v-3.52h-6.72v6.72h19.84v-6.72h-4.8v-4.48h6.080z" id="aplayer-circulation"></path>
                            </svg>
                        </button>
                        <button type="button" class="aplayer-icon aplayer-icon-menu">
                            <svg xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" version="1.1" viewBox="0 0 22 32" width="100%">
                                <use xlink:href="#aplayer-menu"></use>
                                <path class="aplayer-fill" d="M20.8 14.4q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2zM1.6 11.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2zM20.8 20.8q0.704 0 1.152 0.48t0.448 1.12-0.48 1.12-1.12 0.48h-19.2q-0.64 0-1.12-0.48t-0.48-1.12 0.448-1.12 1.152-0.48h19.2z" id="aplayer-menu"></path>
                            </svg>
                        </button>
                    </div>
                </div>
            </div>
            <div class="aplayer-list" style="max-height: 513px; height: 98px;">
                <ol>
                    <li class="aplayer-list-light">
                        <span class="aplayer-list-cur" style="background: #b7daff;"></span>
                        <span class="aplayer-list-index">1</span>
                        <span class="aplayer-list-title">Dear friends</span>
                        <span class="aplayer-list-author">TRIPLANE</span>
                    </li>
                    <li>
                        <span class="aplayer-list-cur" style="background: #b7daff;"></span>
                        <span class="aplayer-list-index">2</span>
                        <span class="aplayer-list-title">Butter-Fly</span>
                        <span class="aplayer-list-author">和田光司</span>
                    </li>
                    <li>
                        <span class="aplayer-list-cur" style="background: #b7daff;"></span>
                        <span class="aplayer-list-index">3</span>
                        <span class="aplayer-list-title">宵闇花火</span>
                        <span class="aplayer-list-author">葉月ゆら</span>
                    </li>
                </ol>
            </div></div>
    </div >

</html>